import Vue from 'vue'
import App from './App.vue'
// 导入路由
import vueRouter from 'vue-router'
// 注册searchItem的全局的组件---在两个组件引用来。注册在全局main.js
// 引入
import searchItem from '@/components/search.vue'
// 注册组件
Vue.component('searchItem', searchItem)
Vue.config.productionTip = false
    // 安装路由
Vue.use(vueRouter)
    // 引入导航栏组件从vant中
import { NavBar } from 'vant'
// 引入layout布局组件
import { Col, Row } from 'vant';
import { Image as VanImage } from 'vant';
import { Cell, CellGroup } from 'vant';
import { Icon } from 'vant';
import { Search } from 'vant';

Vue.use(Search);
Vue.use(Icon);

Vue.use(Cell);
Vue.use(CellGroup);

Vue.use(VanImage);
Vue.use(Col);
Vue.use(Row);
Vue.use(NavBar)
    // 导入标签栏组件
import { Tabbar, TabbarItem } from 'vant'
Vue.use(Tabbar)
Vue.use(TabbarItem)
    // 引入组件
import home from '@/views/home'
import layout from '@/views/layout'
import play from '@/views/play'
import search from '@/views/search'
import VueRouter from 'vue-router'
// 路由规则
const routes = [
        // 路由重定向
        { path: '', redirect: '/layout/home' },
        {
            name: 'layout',
            path: '/layout',
            component: layout,
            children: [
                // 路由元信息，页面跳转可以实现路由跳转传递数据，用$router.meta接收数据
                {
                    name: 'search',
                    path: 'search',
                    component: search,
                    meta: { title: '搜索' }
                },
                { name: 'home', path: 'home', component: home, meta: { title: '首页' } }
            ]
        },
        { name: 'play', path: '/play', component: play }
    ]
    // 创建router实例
const router = new VueRouter({
        routes
    })
    // 把router挂载到Vue实例上
new Vue({
    router,
    render: h => h(App)
}).$mount('#app')